<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>借阅记录</title>
    <script crossorigin="anonymous" integrity="sha384-nvAa0+6Qg9clwYCGGPpDQLVpLNn0fRaROjHqs13t4Ggj3Ez50XnGQqc/r8MhnRDZ"
            src="https://lib.baomitu.com/jquery/1.12.4/jquery.min.js"></script>
    <style>
        #container{
            margin:auto;
            width: 620px;
            font-size: 12px;
        }

        table{
            border-right: solid 1px #000000;
        }

        td{
            height: 30px;
        }
        .cell-head{
            border: solid 1px #000000;
            border-right: 0;
            text-align: center;
            font-size: 16px;
        }
        .cell{
            border: solid 1px #000000;
            border-top: 0;
            border-right: 0;
            text-align: center;
        }

    </style>
</head>
<body>
<div id="container" >

<table border="1" cellspacing="0" cellpadding="0" width="600" >
    <caption style="font-size:30px;color: khaki">用户</caption>
    <tr class="row">
        <td class="cell-head">ID</td>
        <td class="cell-head">用户</td>
        <td class="cell-head">书本</td>
        <td class="cell-head">时间</td>
        <td class="cell-head">审核情况</td>
        <td class="cell-head">用户名</td>
        <td class="cell-head">书本名</td>
    </tr>
    <tr class="row"  th:each="data: ${data}">
        <td class="cell" th:text="${data.id}">Oranges</td>
        <td class="cell" th:text="${data.userId}">Oranges</td>
        <td class="cell" th:text="${data.bookId}">Oranges</td>
        <td class="cell" th:text="${data.createTime}">Oranges</td>
        <td class="cell" th:text="${data.status}">Oranges</td>
        <td class="cell" th:text="${data.userName}">Oranges</td>
        <td class="cell" th:text="${data.bookName}">Oranges</td>
        <td class="cell">

        </td>
    </tr>

</table>
</div>

</body>
</html>